<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>帖子 - 夜读书</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="format-detection" content="telephone=no">
    <meta name="description" content="发现兴趣">
    <meta name="keywords" content="夜读书">
    <link rel="stylesheet" href="{{ asset('/style/css/faxian.css') }}">
    <script src="{{ asset('/scripts/jquery/jquery-1.11.3.min.js') }}"></script>
    <link rel="stylesheet" href="{{ asset('/scripts/PhotoSwipe/css/photoswipe.css') }}"> 
    <link rel="stylesheet" href="{{ asset('/scripts/PhotoSwipe/css/default-skin/default-skin.css') }}"> 
    <script src="{{ asset('/scripts/PhotoSwipe/js/photoswipe.min.js') }}"></script> 
    <script src="{{ asset('/scripts/PhotoSwipe/js/photoswipe-ui-default.min.js') }}"></script>
</head>
<body class="ns-cricle-bg">
    <div id="container">
        @include('faxian.nav_top')
        <div class="mod-nav fixed">
            <div class="nav-item"><a href="{{url('faxian')}}">动态</a></div>
            <div class="nav-item on"><a href="{{url('tiezi/lists')}}">帖子</a></div>
            <div class="nav-item"><a href="{{url('wenzhang/lists')}}">文章</a></div>
            <div class="nav-item"><a href="{{url('shuzhai/lists')}}">书摘</a></div>
        </div>
        <div class="mod-post" style="padding-top: 90px;">
            @foreach($tiezilists as $tiezilist)
            <div class="mod-post-list-item">
                <div class="mod-feed-header ">
                    <div class="mod-avatar">
                        <div class="G-img-wrap">
                            @if(Session::get('nameid') == $tiezilist->users->uid)
                                <a class="aw-user-name" href="{{url('mobile/myhome')}}">
                            @else
                                <a class="aw-user-name" href="{{url('mobile/uhome/'. $tiezilist->users->uid)}}">
                            @endif
                            @if($tiezilist->users->avatar_file_min!="")
                                <img src="{{ url($tiezilist->users->avatar_file_min) }}">
                            @else
                                <img src="{{url('usersface/default/avatar-min.png')}}">
                            @endif
                            </a>
                        </div>
                    </div>                    
                    <div class="usr-name">
                        <span class="name flex-wrap">
                            <p class="username">{{$tiezilist->users->user_name}}</p>
                            <p class="ty">
                                <span class="time" style="">{{date('m-d',$tiezilist->add_time)}}</span> 
                                <span class="yue" style="padding-left:10px;">阅: {{$tiezilist->click}}</span>                                
                            </p>                            
                        </span>
                    </div>                   
                </div>
                <a href="{{url('tiezi/tiezipinglun/'.$tiezilist->id)}}">
                <div class="mod-feed-content" style="cursor:pointer;">                    
                    @if( mb_strlen(strip_tags($tiezilist->content)) < 160 )
                        {!!$tiezilist->content!!}
                    @else
                        {!!mb_substr($tiezilist->content, 0, 160)!!}...<font color="#337ab7">全文>></font>
                    @endif                    
                </div>
                </a>
                @if($tiezilist->imglist != null)
                <div class="mod-feed-img">
                    @foreach($tiezilist->imglist as $key => $img)
                    <div id="myphoto" class="g-img-item" style="cursor:pointer;" onclick="openPhotoSwipe('{{$tiezilist->PhotoSwipe}}', {{$key}})">
                        <img src="{{url('tiezi_img/' . $img)}}">
                    </div>
                    @endforeach
                    @if($tiezilist->imgcount > 3)
                    <span class="num">{{$tiezilist->imgcount}}图</span>
                    @endif
                </div>
                @endif
                <div class="mod-feed-footer">
                    <a href="{{url('tiezi/tiezipinglun/'.$tiezilist->id)}}">
                        <div class="opt-item">                        
                            <span class="">评论</span>
                            <span>{{$tiezilist->pingluncount}}</span>                        
                        </div>
                    </a>
                    <a href="javascript:;" onClick="dianzan({{$tiezilist->id}});">
                        <div class="opt-item">
                            <span class="">点赞</span>
                            <span class="dianzan_{{$tiezilist->id}}">{{$tiezilist->dianzan}}</span>
                        </div>
                    </a>
                </div>
            </div>
            @endforeach
            <a href="javascript:showBg();"><div class="creater-publish v3-1"></div></a>
        </div>
        {!! $tiezilists->render() !!}  
    </div>

    <!-- 弹出遮罩层 -->
    <div id="dialog" onclick="closeBg();">
        <div class="creater-entry">
            <ul class="creater-list">
                <li class="creater-item tiezi" id="tiezi">
                    <a href="{{url('tiezi/pubtiezi')}}">
                        <div class="item">
                            <div class="item-contain">
                                <i class="icon icon-post"></i>
                                <span class="txt">帖子</span>
                            </div>
                        </div>
                    </a>
                </li>
                <li class="creater-item mixed" id="wenzhang">
                    <a href="{{url('wenzhang/pubwenzhang')}}">
                        <div class="item">
                            <div class="item-contain">
                                <i class="icon icon-imgtxt"></i>
                                <span class="txt">文章</span>
                            </div>
                        </div>
                    </a>
                </li>
                <li class="creater-item shuzhai" id="shuzhai">
                    <a href="{{url('mobile/search')}}" return false;>
                        <div class="item">
                            <div class="item-contain">
                                <i class="icon icon-live"></i>
                                <span class="txt">书摘</span>
                            </div>
                        </div>
                    </a>
                </li>
            </ul>
        </div>
        <div class="creater-close mod-close"><i class="G-ico G-ico-del-life"></i></div>
    </div>
    <!-- 弹出遮罩层end -->

    @include('tiezi.showpic')
    
<script>
function openPhotoSwipe(data,index)
{    
    //alert(index);
    var arr = data.split(',');
    var pswpElement = document.querySelectorAll('.pswp')[0];
    // var items = [
    //     {
    //         src: data,
    //         w: 950,
    //         h: 534
    //     }
    // ];
    var items = [];
    for ( var i = 0; i < arr.length; i++) {
        items.push({src:'{{url('tiezi_img'). '/'}}' + arr[i],w:964,h:1024});
        //console.log(arr[i]);
    }
    
    var options = {
        index: index,
        loop: false,
        closeOnScroll: false,       
        history: true,
        focus: true,
        showAnimationDuration: 0,
        hideAnimationDuration: 0
        
    };
    
    var gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, items, options);
    gallery.init();
}

function dianzan(tieziid)
{
    //点赞
    $.ajax({
        type : 'POST',
        url : '{{url('tiezi/dianzan')}}',
        data : {
            'tieziid' : tieziid
        },
        dataType : 'html',
        success : function(data) {
            if(data == 1)
            {
                Toast('登录后点赞', 1000);
            }
            if(data == 2)
            {
                Toast('+1', 1000);
                var n = $('.dianzan_'+ tieziid).html();
                n++;
                $('.dianzan_'  + tieziid).html(n);
            }
            if(data == 3)
            {
                Toast('你已经点过赞了', 1000);
            }
        },
        error : function(e) {
            //console.log(e);
            alert('发表失败');
        }
    });
}

//自定义弹框
function Toast(msg,duration){
    duration=isNaN(duration)?3000:duration;
    var m = document.createElement('div');
    m.innerHTML = msg;
    m.style.cssText="padding:0 6px;opacity: 0.7;height: 30px;color: rgb(255, 255, 255);line-height: 30px;text-align: center;border-radius: 5px;position: fixed;top: 40%;left: 50%;transform:translate(-50%,-50%);-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);z-index: 999999;background: rgb(0, 0, 0);font-size: 12px;";
    document.body.appendChild(m);
    setTimeout(function() {
        var d = 0.5;
        m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in';
        m.style.opacity = '0';
        setTimeout(function() { document.body.removeChild(m) }, d * 1000);
    }, duration);
}
</script>

<script type="text/javascript">     
    function showBg() 
    {   
        //显示 jQuery 遮罩层  
        $("#dialog").show(); 
        //使其遮罩下方内容不可滚动,取消存在的滚动条
        $("body").css("overflow","hidden");
        //手机端浏览器遮罩下方内容不可滚动
        $("#dialog").bind("touchmove",function(e){
             e.preventDefault();
        });
    }

    function closeBg() 
    { 
        //关闭 jQuery 遮罩层
        $("#dialog").hide();
        //释放滚动
        $("body").css("overflow","auto")
    }

    tiezi.addEventListener('click',function(e){               
        e.stopPropagation();//终止事件冒泡            
    },false);

    wenzhang.addEventListener('click',function(e){               
        e.stopPropagation();//终止事件冒泡            
    },false);

    shuzhai.addEventListener('click',function(e){               
        e.stopPropagation();//终止事件冒泡            
    },false);
</script> 
</body>
</html>
